<!DOCTYPE html>
<!--[if lt IE 9 ]>     <html class="no-js lt-ie10 lt-ie9"> <![endif]-->
<!--[if IE 9 ]>        <html class="no-js ie9 lt-ie10"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html class="no-js"> <!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>Jesse Milan - Portfolio</title>
    <meta name="description" content="Jesse Milan is a Full-Stack web developer. He builds enterprise applications in C#.Net MVC, and small business websites in PHP and MySQL. He uses jQuery and Bootstrap 3 to help create a beautiful, usable web.">
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <link rel="stylesheet" href="css/bootstrap.css" type="text/css" media="screen">
	<link rel="stylesheet" href="css/normalize.css" type="text/css" media="screen">
    <link rel="stylesheet" href="css/main.css" type="text/css" media="screen">
    <style>
		
    </style>
</head>
<body>

	<!--<a data-section-id="1" class="to-section arrow-wrap"><span class="arrow"></span></a>-->
    <a class="to-section button_down_container" data-section-id="1" title="SCROLL DOWN">
        <div class="arrow-down arrow_pos1 arrowflip1"></div>
        <div class="arrow-down arrow_pos2 arrowflip2"></div>
    </a>
    
	<header class="navbar navbar-fixed-top ">

        <div class="navbar-header" role="navigation">
          <div class="container">
              <button type="button" class="navbar-toggle" >
                 <span class="sr-only">Menu</span>
                 <span class="icon-bar"></span>
                 <span class="icon-bar"></span>
                 <span class="icon-bar"></span>
              </button>
              <a class="to-section navbar-brand" data-section-id="0">Jesse <span>Milan</span></a>
          </div>
        </div>
        <div class="collapse navbar-collapse" id="main-navbar-collapse">
            <ul class="nav navbar-nav">
                <li class="active"><a class="to-section" data-section-id="1">About</a></li>
                <li><a class="to-section" data-section-id="2">Portfolio</a></li>
                <li><a class="to-section" data-section-id="3">Contact</a></li>
            </ul>
        </div>
            
	</header>
    
    <div class="img-holder"  data-image="images/Slide1.jpg" data-cover-ratio="1" data-extra-height="0">
    	<div class="container">
            <div class="holder">
                <div class="holder-inner">
                    <span class="holder-description">[ Developer - Consultant - Mentor ]</span>
                    <div class="title-holder">
                        <h1 class="title slide-1-text">Jesse <span>Milan</span></h1>                    
                    </div>
                    <div class="btn-holder">
                        <a data-section-id="1" class="to-section title-button">View Portfolio</a>
                    </div>
                </div>
            </div>
        </div>
    </div> 
        
    <section id="AboutSection" class="container">
      <div class="row">
        	<div class="header-block">
            	<h1 class="section-title"><span>ABOUT JESSE</span></h1>
            </div>
        </div>
        
        <div class="row">
       	  <div class="description-block">
            	I am a <span>Full-Stack</span> Senior Web Developer.
                I develop enterprise applications in <span>C#.NET MVC5</span> with <span>MS SQL</span> on <span> Azure</span>. 
                I build custom CMS's and small business websites in <span>PHP</span> and <span>MySQL</span>. 
                I use <span>Bootstrap 3</span> and <span> jQuery</span> for responsive layouts.
                See my <span>Portfolio</span> below for examples of my work.
            </div>
        </div>
        
        <div class="row">
       	  <div class="content-block">
            	<div class="col-md-6">
                	<figure class="about-icon"><img src="images/brand-portfolio.png" /></figure>
                    <div class="about-box">
                    	<h3><a data-section-id="2" class="to-section">Portfolio</a></h3>
                        <p>I'm proud of my work. I have built tools
                      for complex ETL data conversions, Enterprise Research Portals for Large Medical Institutions, custom CMS websites for small businesses, and much more!</p>
                    </div>
                </div>
                
                <!--<div class="col-md-4">
                	<figure class="about-icon"><img src="images/brand-toolbox.png" /></figure>
                    <div class="about-box">
                    	<h3>Toolbox</h3>
                        <p>Some helpful things I have discovered along the way. Helper scripts for jQuery go-to's, PHP CRUD Object class, and some general tips on Bootstrap and MVC.</p>
                    </div>
                </div>-->
                
                <div class="col-md-6">
                	<figure class="about-icon"><img src="images/brand-contact.png" /></figure>
                    <div class="about-box">
                    	<h3><a data-section-id="3" class="to-section">Contact</a></h3>
                        <p>I am a contractor and free-lancer. If you like my work and are interested in talking with me about a project you have, don't hesitate to reach out. I'd love to work with you!</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <div class="img-holder" data-image="images/Slide2.jpg" data-cover-ratio=".75" data-extra-height="0">
        <div class="container">
            <div class="holder">
                <div class="holder-inner">
                    <div class="title-holder">
                        <h1 class="title">See What I <span>Do</span></h1>                    
                    </div>
                    <div class="description-block">
                        Beautiful, responsive design backed by S.O.L.I.D. code. Isn’t that how it should be? If you’re going to do something, do it right the first time. 
                    </div>
                    <!--<div class="btn-holder">
                        <a data-section-id="2" class="to-section title-button">Portfolio</a>
                    </div>-->
                </div>
            </div>
        </div>
    </div>    

    <section id="PortfolioSection" class="container">
      <div class="row">
        	<div class="header-block">
            	<h1 class="section-title"><span>Portfolio</span></h1>
            </div>
        </div>
       
        <div id="mobile-carousel">
          
       	  <div class="portfolio">
                <div class="portfolio-image"> 
                	<a href="http://www.BuddFinn.com" target="_blank">                   
                    	<img id="Carousel1" src="images/Portfolio-BuddFinn.jpg" class="img-responsive">
                    </a>
                </div>
                <div class="portfolio-text">
                	<h3>Budd+Finn</h3>
                    <p><a href="http://www.buddfinn.com" target="_blank">http://www.BuddFinn.com</a></p>
                    <p><strong>Technologies Used: HTML5, Bootstrap 3, jQuery, PHP5, MySQL</strong></p>
                	<p class="hidden-xs">Worked with Graphic Designer to create clean, beautiful, useful web presence for local boutique home furnishings store. Developed responsive site for mobile, tablet, and PC, and built custom Content Management System for owner to maintain products and information. Also coordinated with the business owners to launch website in tandem with business goals. 
</p>
            	</div>
            </div>
            
            <div class="portfolio">
            	<div class="portfolio-image">  
                	<a href="http://www2.portofportland.com/airports/troutdale" target="_blank">
            			<img id="Carousel2" src="images/Portfolio-PortofPortland.jpg" class="img-responsive"> 
                    </a>
</div>
                <div class="portfolio-text">
	                <h3>Port of Portland</h3>
                    <p><a href="http://www2.portofportland.com/airports/">http://www.PortOfPortland.com</a></p>
                    <p><strong>Technologies Used: C#.NET, ASP.NET MVC4, jQuery, Bootstrap 3, Entity Framework, SQL 2012, NUnit, MBUnit, Selenium</strong></p>
                	<p class="hidden-xs"> Lead the redevelopment of the Port of Portland public agency website, which gets over 1 million page views per month, from classic ASP into ASP.NET MVC4 using Visual Studio 2012. Utilized jQuery and Bootstrap 3 to provide dynamic content and responsive layout. Built and consumed web services over secure network infrastructure using SOAP, WCF and RESTful methodologies.</p>
              </div>
            </div>
            <div class="portfolio">
            	<div class="portfolio-image"> 
                	<a href="http://www.DearDrummer.com" target="_blank">
	                    <img id="Carousel3" src="images/Portfolio-DearDrummer.jpg" class="img-responsive"> 
                    </a>
</div>         
                <div class="portfolio-text">
                	<h3>Dear Drummer</h3>
                    <p><a href="http://www.deardrummer.com" target="_blank">http://www.DearDrummer.com</a></p>
                    <p><strong>Technologies Used: HTML5, CSS3, PHP, Wordpress</strong></p>
                	<p class="hidden-xs">Customized Wordpress to use responsive design principles and allow streaming music for local Portland Rock Band (for which I play bass). </p>
              </div> 
            </div>
            
            <div class="portfolio">
            	<div class="portfolio-image">  
                	<a href="http://www.RealityFootball.net" target="_blank">
            			<img id="Carousel2" src="images/Portfolio-RealityFootball.jpg" class="img-responsive"> 
                    </a>
				</div>
                <div class="portfolio-text">
	                <h3>Reality Football</h3>
                    <p><a href="http://www.RealityFootball.net" target="_blank">http://www.RealityFootball.net</a></p>
                    <p ><strong>                    
Technologies Used: C#.NET MVC 5, Entity Framework 6.1, Code-First Development, Windows Azure, Windows Identity 2.0, jQuery, Bootstrap 3</strong>
					</p>
                    <p class="hidden-xs">
Created a game which is a spin-off from Fantasy Football. Worked with Product Owner to establish rules of the game and used those rules to drive requirements and design. Implemented Windows Identity 2.0 for Authentication, utilized Code-First development for managing database schema changes,  and deployed to Windows Azure.
                    </p>
                </div>
            </div>
            
        </div>
                
</section>

<section id="ContactSection"></section>
    <div class="img-holder" data-image="images/Slide3.jpg" data-cover-ratio="1" data-extra-height="10">
    	<div class="container">
            <div class="holder">
                <div class="holder-inner">
                    <div class="title-holder">
                        <h1 class="title">Contact <span>Me</span></h1>                    
                    </div>
                    <div id="contact-form" class="description-block">
                        <div class="form-group">
                            <label for="Email">Email:</label>
                            <input class="form-control" type="text" id="Email" />
                            <label class="error"></label>
                            <label for="Subject">Subject:</label>
                            <input class="form-control" type="text" id="Subject" />
                            <label class="error"></label>
                            <label for="Comment">Message:</label>
                            <textarea class="form-control" id="Message"></textarea>
                            <label class="error"></label>
                    	</div>
                    </div>
                    
                    <div id="success-message" style="display: none;">
                    	<p>
                        	Thank You! Your message has been sent successfully! 
                        </p>
                    </div>
                    
                    <div id="error-message" style="display: none;">
                    	<p>
                        	I'm sorry, something went wrong send this email. Please ensure you have filled everything out and try again.
                        </p>
                    </div>
                    
                    <div class="btn-holder">
                        <a id="send-message" class="title-button">Send</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
	
    <!--<section id="ToolboxSection" class="container">
        <p>Pid ultrices mid ultrices aliquet porttitor. Tristique est turpis lacus. Nec mid, nisi eu magnis? Phasellus? Facilisis sed urna integer in. Pulvinar! Lacus enim dapibus facilisis, sociis ut turpis habitasse nunc a egestas placerat in mattis! Turpis sed? Sit pid magna sociis vel a porttitor, enim ac! Porttitor, lorem odio a tincidunt urna scelerisque, augue. Cursus, et penatibus, ridiculus tortor.</p>

        <p>Urna sed lorem a mus duis cras mattis turpis arcu facilisis mattis tincidunt sagittis lorem, elit elit porttitor turpis? Risus purus! Mus urna tortor adipiscing dictumst, purus, sit turpis, amet mid nisi non hac in proin nunc turpis velit non mauris turpis natoque, aliquam, ac dictumst parturient lundium pulvinar est integer augue scelerisque scelerisque ultrices nascetur amet odio? Hac.</p>
    </section>-->

<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/modernizr-2.6.2.js"></script>
<script src="js/waypoints.js"></script>
<script src="js/jquery.anyslider.js"></script>
<script src="js/jquery.imageScroll.js"></script>
<script src="js/custom.js"></script>
<script>
	// if user agent is ios/ipad/ipod, disable parallax
	if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
		$('.img-holder').imageScroll({
			parallax: false
		}); 
	} else {
		$('.img-holder').imageScroll(); 
	}
</script>

</body>
</html>